<template>
	<view class="content">
		<view class="tab_type">
			<view class="tabs" :class="{selected: type == 1}" @tap="changeType(1)">招聘</view>
			<view class="tabs" :class="{selected: type == 2}" @tap="changeType(2)">求职</view>
			<view class="tabs " :class="{selected: type == 0}" @tap="changeType(0)">房源</view>
		</view>
		<view class="clear_btn" @tap="clearHistory">清除</view>
		<view class="hlist" v-for="(house,index) in houseList" @click="toDetail" v-if="house.items && type == 0" :data-id="house.targetid" key="index">
			<view class="hlist_img">
				<image class="hlist_img_inner" v-if="house.items && house.items.img" :src="house.items.img.split(',')[0]" mode=""></image>
				<view class="hlist_img_inner1"></view>
			</view>
			<view class="hlist_right">
				<view class="hlist_title">
					<text v-if="house.items.typeId == 1">住宅</text>
					<text v-if="house.items.typeId == 2">店铺</text>
					<text v-if="house.items.typeId == 3">厂房</text>
					<text v-if="house.items.typeId == 4">仓库</text>
					<text v-if="house.items.typeId == 1">-{{house.items.addCopIdName}}</text>
					-{{house.items.buildingName}}
					<text v-if="house.items.typeId == 1 && house.items.shiCount && house.items.tingCount && house.items.wei">-{{house.items.shiCount}}室{{house.items.tingCount}}厅{{house.items.wei}}卫</text>
				</view>
				<view class="hlist_title" style="margin-top: 5rpx;">{{house.items.area}}㎡</view>
				<view class="hlist_position">{{house.address}}</view>
				<view class="hlist_tag">
					<view class="hlist_tag_inner" v-for="(item,index) in house.items.highLightArr" :key="index">{{item}}</view>
				</view>
				<view class="hlist_price" v-if="house.items.unitPrice">￥{{house.items.unitPrice}}/月</view>
				<view class="hlist_price" v-else>价格:面谈</view>
			</view>
		</view>
		<view v-if="type != 0" class="hlist" v-for="(house,index) in houseList" @click="toDetail1" :data-id="house.targetid" key="index">
			<view class="hlist_img"  v-if="house.recruitmentJob && house.recruitmentJob.img">
				<image class="hlist_img_inner" :src="house.recruitmentJob.img.split(',')[0]" mode=""></image>
			</view>
			<view class="hlist_right">
				<view class="q_name">{{house.recruitmentJob.customerName}}</view>
				<view class="hlist_title">{{house.recruitmentJob.contents}}</view>
				<view class="q_link">岗位：<text style="color: #222222">{{house.recruitmentJob.post}}</text></view>
				<view class="q_link">薪资：<text style="color: #222222">{{house.recruitmentJob.salary ? house.recruitmentJob.salary + ' 元/月' : '面谈'}}</text></view>
				<view class="q_tag" v-if="house.recruitmentJob && house.recruitmentJob.highlights">
					<view class="q_tag_inner" v-for="(item,index) in house.recruitmentJob.highlights.split(',')">{{item}}</view>
				</view>
				<view class="p_bottom">
					<view class="p_time">{{house.createTime}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	var _self,timer = null;
	export default {
		data() {
			return {
				type: 1,
				houseList: [],
				highlightAll: [],
				pageNum: 1,
				pageSize: 20,
				nodata: false,
				payArr: []
			}
		},
		onPullDownRefresh() {
			this.pageNum = 1
			this.getList()
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		//页面滚动到底部的事件
		// onReachBottom(){
		// 	let that = this
		// 	if(!that.nodata){
		// 		if(timer != null){
		// 		 clearTimeout(timer);
		// 		}
		// 		timer = setTimeout(function(){
		// 		//加载更多数据
		// 		 that.pageNum ++
		// 		 that.getList();
		// 		}, 1000);
		// 	}
		//  },
		onLoad() {
			this.getSelect("bright_points")
			this.getSelect("leasing_mode")
		},
		methods: {
			//清除浏览记录
			clearHistory(){
				let that = this
				that.$api.request('/api/history/removeByType','',{
					type: that.type
				}, failres => {
					uni.showToast({
						title: failres.msg,
						icon: "none"
					});
				}).then(res => {
					uni.showToast({
						title: "清除成功！",
						icon: "none"
					});
					that.getList()
				})
			},
			changeType(type){
				let that = this
				that.type = type
				that.getList()
			},
			//获取亮点
			getSelect(type){
				let that = this;
				that.$api.request('/api/dict/data/list','',{
					dictType: type
				}, failres => {
					uni.showToast({
						title: failres.msg,
						icon: "none"
					});
				}).then(res => {
					if(type == "bright_points"){
						that.highlightAll = res.rows
					}else if(type == "leasing_mode"){
						that.payArr = res.rows
					}
					this.getList()
				})
			},
			getList(){
				let that = this;
				that.nodata = false
				that.$api.request('/api/history/list','',{
					userId: uni.getStorageSync("userId"),
					targetId: '1',
					pageNum: 1,
					pageSize: 100,
					type: that.type
				}, failres => {
					uni.showToast({
						title: failres.msg,
						icon: "none"
					});
				}).then(res => {
					if(that.pageNum == 1){
						that.houseList=res.rows
					}else{
						res.rows.forEach((item,index) =>{
							that.houseList.push(item)
						})
					}
					if(res.rows.length == 0){
						that.nodata = true
					}else{
						that.nodata = false
					}
					that.houseList.forEach((item,index) =>{
						if(item.items){
							that.houseList[index].items.highLightArr = []
							if(item.items && item.items.highlights){
								let arr = item.items.highlights.split(",")
								for(let i=0;i<arr.length;i++){
									for(let j=0;j<that.highlightAll.length;j++){
										if(arr[i] == that.highlightAll[j].dictCode){
											that.houseList[index].items.highLightArr.push(that.highlightAll[j].dictLabel)
										}
									}
								}
							}
						}
					})
					// 整租合租显示处理
					that.houseList.forEach((item,index) =>{
						if(item.items){
							if(item.items && item.items.addCopId){
								that.payArr.forEach((arrItem,arrIndex) =>{
									if(arrItem.dictCode == item.items.addCopId){
										that.houseList[index].items.addCopIdName = arrItem.dictLabel
									}
								}) 
							}
						}
					})
					// console.log(that.houseList)
				})
			},
			toDetail(event){
				uni.navigateTo({
					url: '../houseDetail/houseDetail?id=' + event.currentTarget.dataset.id
				})
			},
			toDetail1(event){
				uni.navigateTo({
					url: '../jobDetail/jobDetail?id=' + event.currentTarget.dataset.id
				})
			},
		}
	}
</script>

<style lang="scss">
	.content{
		width: 100%;
		background: #F5F5F5;
		min-height: 100vh;
		.clear_btn{
			border: 1px solid #007AFF;
			color: #007AFF;
			font-size: 32rpx;
			padding: 4rpx 10rpx;
			border-radius: 10rpx;
			position: absolute;
			top: 20rpx;
			right: 20rpx;
		}
		.q_name{
			font-size: 36rpx;
			color: #232A3A;
			margin-right: 20rpx;
			font-weight: bold;
		}
		.q_tag{
			display: flex;
			align-items: center;
			flex-wrap: wrap;
			padding: 10rpx 0;
			.q_tag_inner{
				color: #3388FF;
				border: 1rpx solid #3388FF;
				font-size: 28rpx;
				margin-right: 20rpx;
				padding: 5rpx 10rpx;
				border-radius: 5rpx;
			}
		}
		.p_bottom{
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 10rpx;
			.p_time{
				color: #C2C2C2;
				font-size: 30rpx;
			}
		}
		.tab_type{
			padding: 30rpx;
			height: 60rpx;
			display: flex;
			align-items: center;
			.tabs{
				font-size: 32rpx;
				display: inline-block;
				background: #EFEFEF;
				color: #979797;
				padding: 10rpx 20rpx;
				border-radius: 20rpx;
				margin-right: 20rpx;
				margin-bottom: 20rpx;
			}
			.selected{
				background: #56CC93;
				color: #FFFFFF;
			}
		}
		.hlist{
			width: 100%;
			margin: 0 auto;
			padding-bottom: 30rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			background: #FFFFFF;
			padding: 20rpx 0;
			border-bottom: 1rpx solid #ebebeb;
			.hlist_img{
				width: 200rpx;
				height: 165rpx;
				border-radius: 10rpx;
				margin-left: 20rpx;
				overflow: hidden;
				.hlist_img_inner{
					width: 200rpx;
				}
				.hlist_img_inner1{
					width: 200rpx;
					height: 165rpx;
					background: url('../../static/img/10.jpg');
					background-size: 100% 100%;
				}
			}
			.hlist_right{
				margin-left: 20rpx;
				width: calc(100% - 230rpx);
				.hlist_title{
					font-size: 36rpx;
					color: #333333;
					margin-top: 20rpx;
				}
				.q_link{
					font-size: 36rpx;
					margin-bottom: 10rpx;
				}
				.hlist_position{
					font-size: 30rpx;
					color: #666666;
					margin-top: 10rpx;
				}
				.hlist_tag{
					width: 100%;
					display: flex;
					align-items: center;
					flex-wrap: wrap;
					.hlist_tag_inner{
						// background: #F2F2F2;
						padding: 5rpx 20rpx;
						font-size: 28rpx;
						color: #666666;
						border-radius: 10rpx;
						margin-right: 20rpx;
						margin-top: 10rpx;
						border: 1rpx solid #999999;
					}
				}
				.hlist_price{
					font-size: 36rpx;
					color: red;
					margin-top: 20rpx;
				}
			}
		}
	}
</style>
